<template>
  <div>

    <Card>
      <div style="display:flex;align-items: center;justify-content: space-between;">
        <div style="display:flex;">
          <Input
            placeholder="请输入场馆名称"
            style="width:300px;margin-right:10px"
            @on-change="changeOrder"
            suffix="ios-search"
            v-model="museumName"
            clearable
          ></Input>
          <DatePicker transfer :disabled="false" type="daterange" placeholder="选择起止时间" style="width: 300px;" v-model="time" :editable="false" @on-change="changeOrder"></DatePicker>
        </div>
      </div>
      <Table
        class="table"
        :loading="loading"
        highlight-row
        :columns="columns"
        :data="data"
      ></Table>
      <Page show-total class="page" :total="total" :current.sync="current" show-elevator @on-change="changePage" />
    </Card>

  </div>
</template>

<script>
  import axios from 'axios'
  export default {
      data() {
        return {
          loading: false,
          columns:[
            { title: "登录时间", key: "gmtCreate", align: "center"},
            { title: "IP地址", key: "ip", align: "center" },
            { title: "省份", key: "province", align: "center"},
            { title: "城市", key: "city", align: "center"},
            { title: "场馆名称", key: "museumName", align: "center"},
            { title: "用户名称", key: "userName", align: "center"},
            { title: "用户手机号", key: "phone", align: "center" },
            
            
          ],
          data: [],
          total: 10,
          size: 10,
          current: 1,
          time: [],
          museumName: '',



        }
      },
      created(){
        this.getSystemLoginLog()
      },
      methods:{
        changePage(data){
          this.current = data
          this.getSystemLoginLog()
        },
        changeOrder(){
          this.current = 1
          this.getSystemLoginLog()
        },
        getSystemLoginLog(){
          this.loading = true
          this.$http("/stage/systemMonitoring/getSystemLoginLog", {
            current: this.current,
            museumName: this.museumName,
            end: this.time[1]?this.getTime(this.time[1]):'',
            size: this.size,
            start: this.time[0]?this.getTime(this.time[0]):''
          }, "post", res => {
            if (res.data.code == 200) {
              this.data = res.data.data.records
              this.total = res.data.data.total
            }else{
              this.$Message.error(res.data.msg);
            }
            this.loading = false
          })
        },

      }
  }
</script>

<style scoped>

</style>